<template>
	<div class="sys-org-container">
		<el-dialog v-model="state.isShowDialog" draggable :close-on-click-modal="false" width="700px">
			<template #header>
				<div style="color: #fff">
					<el-icon size="16" style="margin-right: 3px; display: inline; vertical-align: middle"> <ele-Edit />
					</el-icon>
					<span> {{ props.title }} </span>
				</div>
			</template>
			<el-form :model="state.ruleForm" ref="ruleFormRef" label-width="auto">

				<el-form-item label="名称" prop="materielLevelName"
					:rules="[{ required: true, message: '机构名称不能为空', trigger: 'blur' }]">
					<el-input v-model="state.ruleForm.materielLevelName" placeholder="名称" clearable class="input" />
				</el-form-item>
				<el-form-item label="描述" prop="materielLevelDescription"
					:rules="[{ required: true, message: '机构名称不能为空', trigger: 'blur' }]">
					<el-input v-model="state.ruleForm.materielLevelDescription" placeholder="机构名称" clearable
						class="input" />
				</el-form-item>

			</el-form>
			<template #footer>
				<span class="dialog-footer">
					<el-button @click="cancel">取 消</el-button>
					<el-button type="primary" @click="submit">确 定</el-button>
				</span>
			</template>
		</el-dialog>
	</div>
</template>

<script lang="ts" setup name="EditLocation">
	import { onMounted, reactive, ref } from 'vue';
	import { WmsApi } from "/@/api/wh";
	import { ElMessage } from 'element-plus';
	const props = defineProps({
		title: String,
	});
	const emits = defineEmits(['handleQuery']);
	const ruleFormRef = ref();
	const state = reactive({
		isShowDialog: false,
		ruleForm: {},
		specifications: ["xx", "xxx"],
		auxiliaryUnits: ["xxxxx", "xxxxxxxxx"],
		primaryUnits: ['1', '2', '3'],
		ClassificationNames: ['塑料', '金属']

	});

	// onMounted(async () => {
	// 	let resDicData = await getAPI(SysDictDataApi).apiSysDictDataDataListCodeGet('org_type');
	// 	state.orgTypeList = resDicData.data.result;
	// });

	// 打开弹窗
	const openDialog = () => {

		state.isShowDialog = true;
	};

	// 关闭弹窗
	const closeDialog = () => {

		state.isShowDialog = false;
	};

	// 取消
	const cancel = () => {
		state.isShowDialog = false;
	};

	// 提交
	const submit = () => {
		ruleFormRef.value.validate(async (valid) => {
			if (!valid) return;
			WmsApi().putNewClass(state.ruleForm).then(
				res => {
					ElMessage.success('新增成功');
				}
			)
			closeDialog();

		});
	};

	// 导出对象
	defineExpose({ openDialog });
</script>
<style scoped lang="scss">
	.fl {
		display: flex;

	}

	.aligning1 {
		flex: 5;
		margin-right: 40px;
	}

	.aligning2 {
		flex: 5;
	}
</style>